<!--
文件上传
-->
<template>
  <div class="uploader-common">
    <p class="uploader-title">上传附件</p>
    <van-uploader v-model="fileList" multiple :before-read="beforeRead" :after-read="afterRead" />
    <p class="uploader-tips">单个附件上传大小为100M，支持格式：icon，jpg,png,jpeg,bmp,ts,chm,doc,docx,mp3.7z</p>
  </div>
</template>
<script>
import { Uploader, Toast } from "vant";
export default {
  components: {
    [Uploader.name]: Uploader,

    [Toast.name]: Toast
  },
  data() {
    return {
      fileList: [
        { url: "https://img.yzcdn.cn/vant/cat.jpeg" },
        // Uploader 根据文件后缀来判断是否为图片文件
        // 如果图片 URL 中不包含类型信息，可以添加 isImage 标记来声明
        { url: "https://cloud-image", isImage: true }
      ]
    };
  },
  methods: {
    //校验
    beforeRead(file) {
    //   if (file.type !== "image/jpeg") {
    //     this.$toast("请上传jpg格式图片");
    //     return false;
    //   }

      return true;
    },
    afterRead(file){
        console.log(file);
        //上传成功后.....
    }
  }
};
</script>
<style lang="less" >
.uploader-common {
  .uploader-title {
    font-size: @fontSize28;
    margin: 2px 0;
  }
  .uploader-tips {
    font-size: @fontSize16;
    width: 100%;
    background-color: #e5e5e7;
    color: #B4B4B4
  }
}
</style>